<template>
    <div>
        <el-menu :default-active="activeIndex" class="el-menu-user-center" background-color="#BCDFFB"
            text-color="#2196F3" align="left" @select="changeUserCenterMenu" :router="true" active-text-color="#FFFFFF">
            <div class="title-img">
                <el-avatar :size="100" :src="userInfo.photo?'http://111.85.220.186:1315/'+userInfo.photo:avatarUrl">
                </el-avatar>
                <h3>{{userInfo.name?userInfo.name:'用户名'}}</h3>
            </div>

            <el-menu-item v-for="menu in menus" :key="menu.index" :index="menu.index">
                <div :class="activeIndex==menu.index?'menu-chosen':'menu-unchosen'">
                    <i :class="menu.icon" class="icon-color"></i>
                    <span style="font-size: 18px;font-family:Microsoft YaHei;">{{menu.label}}</span>
                </div>
            </el-menu-item>
        </el-menu>
    </div>
</template>

<script src="./index.js"></script>
<style lang="scss" src="./index.scss" scoped></style>